import axios from "axios";
import { getToken, removeToken } from "./cookie";
import router from "@/router";


axios.defaults.headers["Content-Type"] = "application/json;charset=UTF-8";  // 设置请求头

// 创建axios实例
const service = axios.create({
  baseURL: "/dev-api",  // api的base_url 请求前缀
  timeout: 5000,  // 请求超时时间
});


// request拦截器 添加token 请求拦截器
service.interceptors.request.use(
  (config) => {  // 请求拦截器
    if(getToken()) {
      config.headers["Authorization"] = "Bearer" +  getToken();  // 让每个请求携带token--['Authorization']为自定义key  value为token值
    }
    return config;
  },
  (error) => {  // 请求错误处理
    console.log(error);
    Promise.reject(error);
  }
)

// 响应拦截器
service.interceptors.response.use(
  (res) => {  // 响应数据
    // 未设置状态码则默认成功状态
    const code = res.data.code;
    const msg = res.data.msg;
    if(code === 3001) {
      ElMessage.error(msg); // 显示错误信息
      removeToken(); // 清除token
      router.push("/oj/login"); // 跳转到登录页面
      return Promise.reject(new Error(msg)); // 抛出错误  抛出异常
    } else if (code !== 1000) {
      ElMessage.error(msg); // 显示错误信息
      return Promise.reject(new Error(msg)); // 抛出错误  抛出异常
    } else {
      return Promise.resolve(res.data); // 返回数据
    }
  },
  (error) => {  // 响应错误
    return Promise.reject(error);  // 抛出错误
  }
);

// 暴露 service  可以在其他地方使用
export default service;

// 同源策略:  协议 + 域名 + 端口  相同
// 同源策略是浏览器的安全策略，它是为了防止跨域请求，不同源的网页不能共享数据，所以浏览器会阻止这种请求。
// 同源策略规定，AJAX请求只能发给同源的网址，不同源的网址不能请求数据。
// 同源策略的限制，使得AJAX只能用于同源的网站，不能用于跨域的网站。
// 跨域请求，是指两个不同源的网站之间的请求。
// 跨域请求的原因，是因为浏览器的同源策略。
// 跨域请求的解决方案，是通过JSONP、CORS、postMessage等方式。

// 浏览器请求 -> 代理服务器 -> 后端接口
